<template>
	<view v-if="type==1&&co.html" class='bf p23' :style="{
		margin:`${co.marginTop}${u} ${co.marginLR}${u} ${co.marginBottom}${u}`,
		borderRadius:co.circle+u,
		background:co.colorBg,
		}">
		<rich-text class="wbba" :nodes="nodes"></rich-text>
	</view>
	<rich-text class="wbba" v-else-if="type==2" :nodes="nodes"></rich-text>
	<u-parse v-else-if="type==3" :content="nodes" @preview="preview" @navigate="navigate" />
</template>

<script>
	import {
		mapState,
		mapActions
	} from 'vuex'
	import uParse from '@/components/uParse/src/wxParse.vue'
	export default {
		name: 'searchBox',
		components: {
			uParse,
		},
		props: {
			type: {
				type: String,
				default: '1'
			},
			co: {
				type: Object,
				default: function() {
					return {
						richText: "",
						topMargin: 0,
					}
				}
			},
			u: {
				type: String,
				default: 'px'
			},
			color: {
				type: String,
				default: ''
			},
			content: {
				type: String,
				default: ''
			},
		},
		data() {
			return {

			}
		},
		computed: {
			nodes() {
				if (this.type == 1) {
					return this.co.html.replace(/\<img/gi, '<img style="width:100%;height:auto"')
				} else {
					return this.content.replace(/\<img/gi, '<img style="width:100%;height:auto"')
				}
			},
		},
		methods: {
			preview(src, e) {
				// do something
				console.log("src: " + src);
			},
			navigate(href, e) {
				// 如允许点击超链接跳转，则应该打开一个新页面，并传入href，由新页面内嵌webview组件负责显示该链接内容
				console.log("href: " + href);
				uni.showModal({
					content: "点击链接为：" + href,
					showCancel: false
				})
			}
		},
		async created() {},
	}
</script>

<style scoped lang="scss">
	@import url("../../uParse/src/wxParse.css");
</style>
